import React, { useContext, useEffect, useMemo, useState } from 'react';
import { Empty, Table } from 'antd';
import { assetImportTableConfig, assetTableConfig } from './DetailTableColumns';
import { AssetChangeManageAPI } from '../common/type';
import { ChangeControllerContext } from '../common/useOAContext';
import Cls from 'classnames';

/**
 * @UpdatePackList OA详情材料表格
 * @param packList 表格数据
 * @returns
 */
const UpdateAssetList: React.FC<AssetChangeManageAPI.IUpdatePackListProps> = ({ packList }) => {
  const { infoObj } = useContext(ChangeControllerContext);
  const [dataSource, setDataSource] = useState<Record<string, any>[]>([]); /** 表格数据 */

  // /** 查询申请详情，并回显数据 */
  // useEffect(() => {
  //   if (packList?.length) setDataSource(packList);
  // }, [packList, infoObj]);

  const columnsMemo = useMemo(() => {
    if (infoObj?.id && infoObj?.changeType) {
      setDataSource(packList);
      if (infoObj?.changeType == '0') {
        return assetTableConfig();
      } else if (infoObj?.changeType == '1') {
        return assetImportTableConfig();
      } else {
        return assetTableConfig();
      }
    } else {
      setDataSource([]);
    }
  }, [infoObj, packList]);

  return (
    <div className="descriptionsType-rootBoxDiv">
      <div className={Cls('list-table', 'UpdatePackTable')} style={{ marginTop: 10 }}>
        {dataSource.length > 0 ? (
          <Table scroll={{ x: 1200, y: '' }} bordered size="small" dataSource={dataSource} columns={columnsMemo} rowKey={'id'} pagination={false} />
        ) : (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
        )}
      </div>
    </div>
  );
};

export default UpdateAssetList;
